<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>vivo智能手机官方商城</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="download/font_2136639_zdwh392r2ve/iconfont.css">
    <link rel="stylesheet" href="css/HomePage.css">
</head>

<body>
    <!-- 头部 -->
    <div class="header" id="head">
        <!-- 版心 -->
        <div class="header-con">
            <ul class="header-l">
                <li>品牌</li>
                <li>Funtouch OS</li>
                <li>体验店</li>
                <li>企业业务</li>
                <li>社区</li>
            </ul>
            <ul class="header-r">
                <span class="iconfont icon-xiazai"></span>
                <li class="downloadApp">下载APP</li>
                <span>|</span>
                <li>购物车</li>
                <li>个人中心</li>
                <div class="erweima">
                    <img src="img/HomePage/erweima.png" alt="">
                    <span>扫描下载  vivo官网APP</span>
                </div>
            </ul>
        </div>
    </div>
    <div class="box">
        <!-- 导航 -->
        <div class="nav">
            <!-- 版心 -->
            <div class="nav-con">
                <div class="logo">
                    <span class="iconfont icon-VIVO"></span>
                </div>
                <ul>
                    <li class="nex ">NEX系列</li>
                    <li class="x">X系列</li>
                    <li class="s">S系列</li>
                    <li class="y">Y系列</li>
                    <li class="z">Z系列</li>
                    <li class="u">U系列</li>
                    <li class="iqoo">IQOO系列</li>
                    <li class="hardware">智能硬件</li>
                    <li class="noclick">商城</li>
                    <li>服务</li>
                </ul>
                <span class="iconfont icon-sousuo-menu"></span>
            </div>
        </div>
        <!-- 导航展示 -->
        <div>
            <!-- NEX -->
            <div class="nav-nex ">
                <div class="nav-nex-con">
                    <dl>
                        <dt>
                            <img src="img/HomePage/nex-1-1.png" alt="">
                            <img src="img/HomePage/nex-1-3.png" alt="">
                            <img src="img/HomePage/nex-1-2.png" alt="">
                        </dt>
                        <dd>NEX 3S</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/nex-2-2.png" alt="">
                            <img src="img/HomePage/nex-2-3.png" alt="">
                            <img src="img/HomePage/nex-2-1.png" alt="">
                        </dt>
                        <dd>NEX3&NEX 3 5G</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/nex-3-3.png" alt="">
                            <img src="img/HomePage/nex-3-2.png" alt="">
                            <img src="img/HomePage/nex-3-1.png" alt="">
                        </dt>
                        <dd>NEX双屏版</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/nex-4-1.png" alt="">
                            <img src="img/HomePage/nex-4-2.png" alt="">
                            <img src="img/HomePage/nex-4-3.png" alt="">
                        </dt>
                        <dd>NEX旗舰版</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/nex-5-3.png" alt="">
                            <img src="img/HomePage/nex-5-1.png" alt="">
                            <img src="img/HomePage/nex-5-2.png" alt="">
                        </dt>
                        <dd>NEX&NEX屏幕指纹版</dd>
                    </dl>
                </div>
                <div class="all-nex">
                    <div class="all-nex-l">
                        <span class="iconfont icon-sangedian-fill"></span>
                        <span>全部NEX机型</span>
                    </div>
                    <div class="all-nex-r">
                        <span class="iconfont icon-duibi"></span>
                        <span>对比NEX机型</span>
                    </div>
                </div>
            </div>
            <!-- X系列 -->
            <div class="nav-x">
                <div class="nav-x-con">
                    <dl>
                        <dt>
                            <img src="img/HomePage/x-1-1.png" alt="">
                            <img src="img/HomePage/x-1-2.png" alt="">
                            <img src="img/HomePage/x-1-3.png" alt="">
                        </dt>
                        <dd>X50 Pro+</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/x-2-2.png" alt="">
                            <img src="img/HomePage/x-2-1.png" alt="">
                            <img src="img/HomePage/x-2-3.png" alt="">
                        </dt>
                        <dd>X50 Pro</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/x-3-2.png" alt="">
                            <img src="img/HomePage/x-3-1.png" alt="">
                            <img src="img/HomePage/x-3-3.png" alt="">
                        </dt>
                        <dd>X50</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/x-4-1.png" alt="">
                            <img src="img/HomePage/x-4-2.png" alt="">
                            <img src="img/HomePage/x-4-3.png" alt="">
                        </dt>
                        <dd>X30 Pro</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/x-5-1.png" alt="">
                            <img src="img/HomePage/x-5-2.png" alt="">
                            <img src="img/HomePage/x-5-3.png" alt="">
                        </dt>
                        <dd>X30</dd>
                    </dl>
                </div>
                <div class="all-x">
                    <div class="all-x-l">
                        <span class="iconfont icon-sangedian-fill"></span>
                        <span>全部X机型</span>
                    </div>
                    <div class="all-x-r">
                        <span class="iconfont icon-duibi"></span>
                        <span>对比X机型</span>
                    </div>
                </div>
            </div>
            <!-- S系列 -->
            <div class="nav-s">
                <div class="nav-s-con">
                    <dl>
                        <dt>
                            <img src="img/HomePage/s-1-1.png" alt="">
                            <img src="img/HomePage/s-1-2.png" alt="">
                            <img src="img/HomePage/s-4-3.png" alt="">
                        </dt>
                        <dd>S7</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/s-2-2.png" alt="">
                            <img src="img/HomePage/s-2-1.png" alt="">
                            <img src="img/HomePage/s-2-3.png" alt="">
                        </dt>
                        <dd>S6</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/s-3-2.png" alt="">
                            <img src="img/HomePage/s-3-1.png" alt="">
                            <img src="img/HomePage/s-3-3.png" alt="">
                        </dt>
                        <dd>S5</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/s-4-1.png" alt="">
                            <img src="img/HomePage/s-4-2.png" alt="">
                            <img src="img/HomePage/s-1-3.png" alt="">
                        </dt>
                        <dd>S1 Pro</dd>
                    </dl>
                    <dl>
                        <dt>
                            <img src="img/HomePage/s-5-1.png" alt="">
                            <img src="img/HomePage/s-5-2.png" alt="">
                            <img src="img/HomePage/s-5-3.png" alt="">
                        </dt>
                        <dd>S1</dd>
                    </dl>
                </div>
                <div class="all-s">
                    <div class="all-s-l">
                        <span class="iconfont icon-sangedian-fill"></span>
                        <span>全部S机型</span>
                    </div>
                    <div class="all-s-r">
                        <span class="iconfont icon-duibi"></span>
                        <span>对比S机型</span>
                    </div>
                </div>
            </div>
            <!-- Y系列 -->
            <div class="nav-y">
                <div class="nav-y-con">
                    <dl>
                        <dt>
                                <img src="img/HomePage/y-1-1.png" alt="">
                                <img src="img/HomePage/y-1-2.png" alt="">
                                <img src="img/HomePage/y-4-3.png" alt="">
                            </dt>
                        <dd>Y37s</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/y-2-2.png" alt="">
                                <img src="img/HomePage/y-2-1.png" alt="">
                                <img src="img/HomePage/y-2-3.png" alt="">
                            </dt>
                        <dd>Y51s</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/y-3-2.png" alt="">
                                <img src="img/HomePage/y-3-1.png" alt="">
                                <img src="img/HomePage/y-3-3.png" alt="">
                            </dt>
                        <dd>Y70s</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/y-4-1.png" alt="">
                                <img src="img/HomePage/y-4-2.png" alt="">
                                <img src="img/HomePage/y-1-3.png" alt="">
                            </dt>
                        <dd>Y50</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/y-5-1.png" alt="">
                                <img src="img/HomePage/y-5-2.png" alt="">
                                <img src="img/HomePage/y-5-3.png" alt="">
                            </dt>
                        <dd>Y9s</dd>
                    </dl>
                </div>
                <div class="all-y">
                    <div class="all-y-l">
                        <span class="iconfont icon-sangedian-fill"></span>
                        <span>全部Y机型</span>
                    </div>
                    <div class="all-y-r">
                        <span class="iconfont icon-duibi"></span>
                        <span>对比Y机型</span>
                    </div>
                </div>
            </div>
            <!-- Z系列 -->
            <div class="nav-z">
                <div class="nav-z-con">
                    <dl>
                        <dt>
                                <img src="img/HomePage/nex-1-1.png" alt="">
                                <img src="img/HomePage/nex-1-3.png" alt="">
                                <img src="img/HomePage/nex-1-2.png" alt="">
                            </dt>
                        <dd>Z6</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/nex-2-2.png" alt="">
                                <img src="img/HomePage/nex-2-3.png" alt="">
                                <img src="img/HomePage/nex-2-1.png" alt="">
                            </dt>
                        <dd>Z5</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/nex-3-3.png" alt="">
                                <img src="img/HomePage/nex-3-2.png" alt="">
                                <img src="img/HomePage/nex-3-1.png" alt="">
                            </dt>
                        <dd>Z5x 712版</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/nex-4-1.png" alt="">
                                <img src="img/HomePage/nex-4-2.png" alt="">
                                <img src="img/HomePage/nex-4-3.png" alt="">
                            </dt>
                        <dd>Z5x</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/nex-5-3.png" alt="">
                                <img src="img/HomePage/nex-5-1.png" alt="">
                                <img src="img/HomePage/nex-5-2.png" alt="">
                            </dt>
                        <dd>Z5</dd>
                    </dl>
                </div>
                <div class="all-z">
                    <div class="all-z-l">
                        <span class="iconfont icon-sangedian-fill"></span>
                        <span>全部Z机型</span>
                    </div>
                    <div class="all-z-r">
                        <span class="iconfont icon-duibi"></span>
                        <span>对比Z机型</span>
                    </div>
                </div>
            </div>
            <!-- U系列 -->
            <div class="nav-u">
                <div class="nav-u-con">
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-1-1.png" alt="">
                                <img src="img/HomePage/s-1-2.png" alt="">
                                <img src="img/HomePage/s-4-3.png" alt="">
                            </dt>
                        <dd>U3</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-2-2.png" alt="">
                                <img src="img/HomePage/s-2-1.png" alt="">
                                <img src="img/HomePage/s-2-3.png" alt="">
                            </dt>
                        <dd>U3x</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-3-2.png" alt="">
                                <img src="img/HomePage/s-3-1.png" alt="">
                                <img src="img/HomePage/s-3-3.png" alt="">
                            </dt>
                        <dd>U1</dd>
                    </dl>
                </div>
                <div class="all-u">
                    <div class="all-u-l">
                        <span class="iconfont icon-sangedian-fill"></span>
                        <span>全部U机型</span>
                    </div>
                    <div class="all-u-r">
                        <span class="iconfont icon-duibi"></span>
                        <span>对比U机型</span>
                    </div>
                </div>
            </div>
            <!-- IQOO系列 -->
            <div class="nav-iqoo">
                <div class="nav-iqoo-con">
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-1-1.png" alt="">
                                <img src="img/HomePage/s-1-2.png" alt="">
                                <img src="img/HomePage/s-4-3.png" alt="">
                            </dt>
                        <dd>IQOO5 Pro</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-2-2.png" alt="">
                                <img src="img/HomePage/s-2-1.png" alt="">
                                <img src="img/HomePage/s-2-3.png" alt="">
                            </dt>
                        <dd>IQOO5</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-3-2.png" alt="">
                                <img src="img/HomePage/s-3-1.png" alt="">
                                <img src="img/HomePage/s-3-3.png" alt="">
                            </dt>
                        <dd>IQOO Z1x</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-4-1.png" alt="">
                                <img src="img/HomePage/s-4-2.png" alt="">
                                <img src="img/HomePage/s-1-3.png" alt="">
                            </dt>
                        <dd>IQOO U1</dd>
                    </dl>
                    <dl>
                        <dt>
                                <img src="img/HomePage/s-5-1.png" alt="">
                                <img src="img/HomePage/s-5-2.png" alt="">
                                <img src="img/HomePage/s-5-3.png" alt="">
                            </dt>
                        <dd>IQOO Neo3</dd>
                    </dl>
                </div>
                <div class="all-iqoo">
                    <div class="all-iqoo-l">
                        <span class="iconfont icon-sangedian-fill"></span>
                        <span>全部IQOO机型</span>
                    </div>
                    <div class="all-iqoo-r">
                        <span class="iconfont icon-duibi"></span>
                        <span>对比IQOO机型</span>
                    </div>
                </div>
            </div>
            <!-- 智能硬件 -->
            <div class="nav-hardware">
                <div class="nav-hardware-con">
                    <dl>
                        <dt>
                              <img src="img/HomePage/hardware1.png" alt="">     
                        </dt>
                        <dd>vivo TWS Neo</dd>
                    </dl>
                    <dl>
                        <dt>
                        <img src="img/HomePage/hardware2.png" alt="">
                        </dt>
                        <dd>vivo WATCH</dd>
                    </dl>
                    <dl>
                        <dt>
                              <img src="img/HomePage/hardware3.png" alt="">  
                        </dt>
                        <dd>vivo TWs 1</dd>
                    </dl>
                </div>
            </div>
        </div>
    </div>
    <!-- banner图 -->
    <div class="banner">
        <img src="img/HomePage/banner-01.png" alt="" class="show">
        <img src="img/HomePage/banner-02.jpg" alt="">
        <img src="img/HomePage/banner-03.png" alt="">
        <img src="img/HomePage/banner-04.jpg" alt="">
        <img src="img/HomePage/banner-05.png" alt="">
        <div class="dot"></div>
        <!-- banner导航 -->
        <div class="banner-nav">
            <ul class="banner-nav-con">
                <li id="nav-con-1">
                    <span>手机</span>
                    <span class="iconfont icon-arrow-left"></span>
                </li>
                <li id="nav-con-2">
                    <span>手机充电</span>
                    <span class="iconfont icon-arrow-left"></span>
                </li>
                <li id="nav-con-3">
                    <span>手机配件</span>
                    <span class="iconfont icon-arrow-left"></span>
                </li>
                <li id="nav-con-4">
                    <span>音乐设备</span>
                    <span class="iconfont icon-arrow-left"></span>
                </li>
                <li id="nav-con-5">
                    <span>智能硬件</span>
                    <span class="iconfont icon-arrow-left"></span>
                </li>
                <li id="nav-con-6">
                    <span>游戏摄影</span>
                    <span class="iconfont icon-arrow-left"></span>
                </li>
                <li id="nav-con-7">
                    <span>日用出行</span>
                    <span class="iconfont icon-arrow-left"></span>
                </li>
            </ul>
            <!-- 手机 -->
            <div class="banner-phone">
                <p>
                    手机
                </p>
                <div>
                    <ul>
                        <li>手机保护膜</li>
                        <li>手机保护壳</li>
                        <li>手机通用配件</li>
                    </ul>
                </div>
                <ul class="banner-phone-type">
                    <li>
                        <img src="img/HomePage/tab-1.webp" alt=""> X系列
                    </li>
                    <li>
                        <img src="img/HomePage/tab-2.webp" alt=""> NEX系列
                    </li>
                    <li>
                        <img src="img/HomePage/tab-3.webp" alt=""> Y系列
                    </li>
                    <li>
                        <img src="img/HomePage/tab-2.webp" alt=""> S系列
                    </li>
                    <li>
                        <img src="img/HomePage/tab-1.webp" alt=""> Z系列
                    </li>
                    <li>
                        <img src="img/HomePage/tab-2.webp" alt=""> U系列
                    </li>
                    <li>
                        <img src="img/HomePage/tab-3.webp" alt=""> iQOO系列
                    </li>
                    <li>
                        <img src="img/HomePage/tab-2.webp" alt=""> 智能硬件
                    </li>
                </ul>
            </div>
            <!-- 手机充电 -->
            <div class="banner-charge">
                <p>
                    手机充电
                </p>
                <div>
                    <ul>
                        <li>数据线</li>
                        <li>充电器</li>
                        <li>移动电源</li>
                    </ul>
                </div>
                <ul class="banner-charge-type">
                    <li>
                        <img src="img/HomePage/tab-11.webp" alt=""> IQOO 120W充电器
                    </li>
                    <li>
                        <img src="img/HomePage/tab-12.webp" alt=""> vivo 33W充电器
                    </li>
                    <li>
                        <img src="img/HomePage/tab-13.webp" alt=""> vivo移动电源
                    </li>
                    <li>
                        <img src="img/HomePage/tab-13.webp" alt=""> vivo USB数据线
                    </li>
                    <li>
                        <img src="img/HomePage/tab-12.webp" alt=""> vivo 65W多口闪充
                    </li>
                    <li>
                        <img src="img/HomePage/tab-12.webp" alt=""> vivo Type-C数据线
                    </li>
                    <li>
                        <img src="img/HomePage/tab-11.webp" alt=""> vivo Type-C数据线
                    </li>
                    <li>
                        <img src="img/HomePage/tab-13.webp" alt=""> 55W车载充电器
                    </li>
                    <li>
                        <img src="img/HomePage/tab-12.webp" alt=""> IQOO Type-C手游
                </ul>
            </div>
            <!-- 手机配件 -->
            <div class="banner-parts">
                <p>
                    手机配件
                </p>
                <div>
                    <ul>
                        <li>保护膜</li>
                        <li>保护壳</li>
                        <li>通用配件</li>
                    </ul>
                </div>
                <ul class="banner-parts-type">
                    <li>
                        <img src="img/HomePage/tab-21.webp" alt=""> Z1硅胶保护壳
                    </li>
                    <li>
                        <img src="img/HomePage/tab-22.webp" alt=""> vivo Pro皮革保护壳
                    </li>
                    <li>
                        <img src="img/HomePage/tab-23.webp" alt=""> iQOO钢化膜
                    </li>
                    <li>
                        <img src="img/HomePage/tab-23.webp" alt=""> iQ00 5 3D曲面
                    </li>
                    <li>
                        <img src="img/HomePage/tab-22.webp" alt=""> iQOO5原装保护膜
                    </li>
                    <li>
                        <img src="img/HomePage/tab-22.webp" alt=""> iQOO5砂岩保护壳
                    </li>
                    <li>
                        <img src="img/HomePage/tab-21.webp" alt=""> vivo S7保护膜
                    </li>
                    <li>
                        <img src="img/HomePage/tab-23.webp" alt=""> Y70s磨砂保护壳
                    </li>
                    <li>
                        <img src="img/HomePage/tab-22.webp" alt=""> iQ00Z1x原装保护膜
                    </li>
                </ul>
            </div>
            <!-- 音乐设备 -->
            <div class="banner-music">
                <p>
                    音乐设备
                </p>
                <div>
                    <ul>
                        <li>有线耳机</li>
                        <li>蓝牙耳机</li>
                        <li>音响</li>
                    </ul>
                </div>
                <ul class="banner-music-type">
                    <li>
                        <img src="img/HomePage/tab-41.webp" alt=""> vivo 无线耳机
                    </li>
                    <li>
                        <img src="img/HomePage/tab-42.webp" alt=""> iQOO影音耳机
                    </li>
                    <li>
                        <img src="img/HomePage/tab-43.webp" alt=""> vivo耳机转接线
                    </li>
                    <li>
                        <img src="img/HomePage/tab-43.webp" alt=""> vivo XE710耳机
                    </li>
                    <li>
                        <img src="img/HomePage/tab-42.webp" alt=""> vivo缤纷耳机
                    </li>
                    <li>
                        <img src="img/HomePage/tab-42.webp" alt=""> iQOO5砂岩保护壳
                    </li>
                    <li>
                        <img src="img/HomePage/tab-41.webp" alt=""> vivo影音耳机
                    </li>
                    <li>
                        <img src="img/HomePage/tab-43.webp" alt=""> vivo XE100原装耳机
                    </li>
                    <li>
                        <img src="img/HomePage/tab-42.webp" alt=""> vivo无线运动耳机
                    </li>
                </ul>
            </div>
            <!-- 智能硬件 -->
            <div class="banner-hard">
                <p>
                    智能硬件
                </p>
                <div>
                    <ul>
                        <li>家用电源</li>
                        <li>体脂称</li>
                        <li>儿童专区</li>
                    </ul>
                </div>
                <ul class="banner-hard-type">
                    <li>
                        <img src="img/HomePage/tab-31.webp" alt=""> vivo WATCH表带
                    </li>
                    <li>
                        <img src="img/HomePage/tab-32.webp" alt=""> vivo WATCH充电底座
                    </li>
                    <li>
                        <img src="img/HomePage/tab-33.webp" alt=""> 乐心手环Mambo5
                    </li>
                    <li>
                        <img src="img/HomePage/tab-33.webp" alt=""> 遥控大师空调伴侣
                    </li>
                    <li>
                        <img src="img/HomePage/tab-32.webp" alt=""> 乐橙AI全泉摄像机
                    </li>
                    <li>
                        <img src="img/HomePage/tab-32.webp" alt=""> 智能体脂秤M2
                    </li>
                    <li>
                        <img src="img/HomePage/tab-31.webp" alt=""> 乐心体脂秤S11
                    </li>
                </ul>
            </div>
            <!-- 游戏摄影 -->
            <div class="banner-game">
                <p>
                    游戏摄影
                </p>
                <div>
                    <ul>
                        <li>外设产品</li>
                        <li>游戏设备</li>
                        <li>摄影配件</li>
                    </ul>
                </div>
                <ul class="banner-game-type">
                    <li>
                        <img src="img/HomePage/tab-51.webp" alt=""> vivo 闪电游戏手柄
                    </li>
                    <li>
                        <img src="img/HomePage/tab-52.webp" alt=""> 飞智影刺手游按键
                    </li>
                    <li>
                        <img src="img/HomePage/tab-53.webp" alt=""> vivo闪电游戏手柄
                    </li>
                    <li>
                        <img src="img/HomePage/tab-53.webp" alt=""> ULANZI 摄影配件
                    </li>
                    <li>
                        <img src="img/HomePage/tab-52.webp" alt=""> 施吉客—体式闫拍杆
                    </li>
                    <li>
                        <img src="img/HomePage/tab-52.webp" alt=""> 智云手机智能云台
                    </li>
                    <li>
                        <img src="img/HomePage/tab-51.webp" alt=""> 镭拓黑鼠标垫
                    </li>
                    <li>
                        <img src="img/HomePage/tab-53.webp" alt=""> 飞智手游指套
                    </li>
                    <li>
                        <img src="img/HomePage/tab-51.webp" alt=""> 插拓T1理线带
                    </li>
                </ul>
            </div>
            <!-- 日常出行 -->
            <div class="banner-life">
                <p>
                    日常出行
                </p>
                <div>
                    <ul>
                        <li>个人护理</li>
                        <li>生活用品</li>
                        <li>箱包配件</li>
                    </ul>
                </div>
                <ul class="banner-life-type">
                    <li>
                        <img src="img/HomePage/tab-61.webp" alt=""> Sleepace字睡石墨烯
                    </li>
                    <li>
                        <img src="img/HomePage/tab-62.webp" alt=""> 乐范魔力贴温情版
                    </li>
                    <li>
                        <img src="img/HomePage/tab-63.webp" alt=""> FRIENDS摆件公仔
                    </li>
                    <li>
                        <img src="img/HomePage/tab-63.webp" alt=""> 须眉便携式剃须刀
                    </li>
                    <li>
                        <img src="img/HomePage/tab-62.webp" alt=""> 赛嘉声波电动牙刷
                    </li>
                    <li>
                        <img src="img/HomePage/tab-62.webp" alt=""> 口气清新漱口水
                    </li>
                    <li>
                        <img src="img/HomePage/tab-61.webp" alt=""> 网易石藁烯热散护颈
                    </li>
                    <li>
                        <img src="img/HomePage/tab-63.webp" alt=""> 石圈烯热敷腰带
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <!-- 专区 -->
    <div class="type">
        <ul class="type-con">
            <li>
                <img src="img/HomePage/type-01.jpg" alt="">
            </li>
            <li>
                <img src="img/HomePage/type-02.jpg" alt="">
            </li>
            <li>
                <img src="img/HomePage/type-03.jpg" alt="">
            </li>
        </ul>
    </div>
    <!-- V抢购 -->
    <div class="vBuy">
        <div class="vBuy-con">
            <img src="img/HomePage/vBuy.png" alt="">
            <span>距离结束</span>
            <span id="h"></span>
            <span>时</span>
            <span id="m"></span>
            <span>分</span>
            <span id="s"></span>
            <span>秒</span>
        </div>
        <span class="more">更多场次 ></span>
    </div>
    <!-- V抢购--商品 -->
    <div class="vBuy-all">
        <div class="vBuy-content">
            <div class="vBuy-goods">
                <div class="item">
                    <dl>
                        <dd>
                            <img src="img/HomePage/vBuy-con1.webp" alt="">
                        </dd>
                        <dt>
                            <h3>vivo 影音耳机 星空灰</h3>
                            <p>8折秒杀</p>
                            <p>
                                <span class="money">￥</span>
                                <span class="price">99</span>
                                <span class="original">￥129</span>
                            </p>
                        </dt>
                    </dl>
                    <img src="img/HomePage/xianliangqianggou.png" alt="" class="discount">
                </div>
                <div class="item">
                    <dl>
                        <dd>
                            <img src="img/HomePage/vBuy-con2.webp" alt="">
                        </dd>
                        <dt>
                        <h3>vivo 10W行充电线</h3>
                        <p>直降20元</p>
                        <p>
                            <span class="money">￥</span>
                            <span class="price">29</span>
                            <span class="original">￥49</span>
                        </p>
                    </dt>
                    </dl>
                    <img src="img/HomePage/xianshicuxiao.png" alt="" class="discount">
                </div>
                <div class="item">
                    <dl>
                        <dd>
                            <img src="img/HomePage/vBuy-con3.webp" alt="">
                        </dd>
                        <dt>
                        <h3>vivo XE100原装耳机</h3>
                        <p>直降10元</p>
                        <p>
                            <span class="money">￥</span>
                            <span class="price">29</span>
                            <span class="original">￥39</span>
                        </p>
                    </dt>
                    </dl>
                    <img src="img/HomePage/xianshicuxiao.png" alt="" class="discount">
                </div>
                <div class="item">
                    <dl>
                        <dd>
                            <img src="img/HomePage/vBuy-con4.webp" alt="">
                        </dd>
                        <dt>
                            <h3>vivo x30/x30 Pro原装保护膜</h3>
                            <p>5折秒杀</p>
                            <p>
                                <span class="money">￥</span>
                                <span class="price">14</span>
                                <span class="original">￥29</span>
                            </p>
                        </dt>
                    </dl>
                    <img src="img/HomePage/5zhemiaosha.png" alt="" class="discount">
                </div>
                <div class="item">
                    <dl>
                        <dd>
                            <img src="img/HomePage/vBuy-con5.webp" alt="">
                        </dd>
                        <dt>
                        <h3>乐心手环5S</h3>
                        <p>直降30元</p>
                        <p>
                            <span class="money">￥</span>
                            <span class="price">139</span>
                            <span class="original">￥169</span>
                        </p>
                     </dt>
                    </dl>
                    <img src="img/HomePage/xianshicuxiao.png" alt="" class="discount">
                </div>
                <div class="item">
                    <dl>
                        <dd>
                            <img src="img/HomePage/vBuy-con6.webp" alt="">
                        </dd>
                        <dt>
                        <h3>VHFO4 探桌面夹子风扇灰色</h3>
                        <p>直降15元</p>
                        <p>
                            <span class="money">￥</span>
                            <span class="price">64</span>
                            <span class="original">￥79</span>
                        </p>
                     </dt>
                    </dl>
                    <img src="img/HomePage/xianshicuxiao.png" alt="" class="discount">
                </div>
                <div class="item">
                    <dl>
                        <dd>
                            <img src="img/HomePage/vBuy-con7.webp" alt="">
                        </dd>
                        <dt>
                        <h3>ULANZl 一字冷靴手机夹ST-O7黑</h3>
                        <p>5折秒杀</p>
                        <p>
                            <span class="money">￥</span>
                            <span class="price">9</span>
                            <span class="original">￥19</span>
                        </p>
                     </dt>
                    </dl>
                    <img src="img/HomePage/5zhemiaosha.png" alt="" class="discount">
                </div>
                <div class="item">
                    <dl>
                        <dt>
                        <p>下一场</p>
                        <p>10:00</p>
                        <div class="see">
                            去看看
                        </div>
                    </dt>
                    </dl>
                </div>
            </div>
        </div>
        <span class="iconfont icon-zuojiantou1" id="prev"></span>
        <span class="iconfont icon-zuojiantou" id="next"></span>
    </div>
    <!-- 热卖区 -->
    <div class="HotSale">
        <h3>热卖专区</h3>
    </div>
    <!-- 热卖区--商品 -->
    <div class="HotSale-con">
        <div class="HotSale-content">
            <dl>
                <dd>
                    <img src="img/HomePage/hot-01.webp" alt="">
                </dd>
                <dt>
                    <h3>iQOO Neo3 5G版</h3>
                    <p>144Hz高刷竞速屏/高通骁龙865</p>
                    <p>￥2998.00</p>
                </dt>
            </dl>
        </div>
        <div class="HotSale-content">
            <dl>
                <dd>
                    <img src="img/HomePage/hot-02.webp" alt="">
                </dd>
                <dt>
                    <h3>vivo x50 5G版</h3>
                    <p>超感光夜摄|超稳运动拍摄</p>
                    <p>￥3298.00</p>
                </dt>
            </dl>
        </div>
        <div class="HotSale-content">
            <dl>
                <dd>
                    <img src="img/HomePage/hot-03.webp" alt="">
                </dd>
                <dt>
                    <h3>iQOO Neo3 5G版</h3>
                    <p>144Hz高刷竞速屏/高通骁晓龙865</p>
                    <p>￥2998.00</p>
                </dt>
            </dl>
        </div>
    </div>
    <!-- 精品手机 -->
    <div class="phone">
        <h3>精品手机</h3>
    </div>
    <!-- 精品手机-商品 -->
    <div class="phone-con">
        <ul>
            <li>
                <img src="img/HomePage/phone-01.webp">
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/phone-02.webp" alt="">
                    </dd>
                    <dt>
                        <h3>iQOO 3 5G版</h3>
                        <p>55W超快闪充</p>
                        <p>￥3998.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/phone-03.webp" alt="">
                    </dd>
                    <dt>
                        <h3>iQOOZ1 5G版</h3>
                        <p>天玑1000Plus旗舰芯片</p>
                        <p>￥2298.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/phone-04.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo Y70s 5G版</h3>
                        <p>4500mAh+双引擎闪充</p>
                        <p>￥1998.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/phone-05.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo X305G版</h3>
                        <p>双模5G全网通/20倍变焦</p>
                        <p>￥2998.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/phone-06.webp" alt="">
                    </dd>
                    <dt>
                        <h3>NEX 3S5G版</h3>
                        <p>8GB+256GB/高通骁龙865</p>
                        <p>￥4998.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/phone-07.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo Y5s</h3>
                        <p>5000mAh续航</p>
                        <p>￥1398.00</p>
                    </dt>
                </dl>
            </li>
        </ul>
    </div>
    <!-- 精品配件 -->
    <div class="parts">
        <h3>精品配件</h3>
        <ul>
            <li>手机充电</li>
            <li>手机配件</li>
            <li>音乐设备</li>
            <li>更多</li>
            <li>></li>
        </ul>
    </div>
    <!-- 精品配件-商品 -->
    <div class="parts-con">
        <ul>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-01.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo WATCH</h3>
                        <p>24小时健康监测</p>
                        <p>￥1299.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-02.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo 18W 10000mAh</h3>
                        <p>双向快充移动电源</p>
                        <p>￥99.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-03.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo缤纷耳机</h3>
                        <p>专业调音三频均衡</p>
                        <p>￥49.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-04.webp" alt="">
                    </dd>
                    <dt>
                        <h3>iQOO影音耳机</h3>
                        <p>K歌级麦克风</p>
                        <p>￥129.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-05.webp" alt="">
                    </dd>
                    <dt>
                        <h3>iQOO闪电游戏手柄</h3>
                        <p>即连即玩│支持海量游戏</p>
                        <p>￥199.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-06.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo TWS Neo真无线耳机</h3>
                        <p>高清音质|游戏低延迟</p>
                        <p>￥499.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-07.webp" alt="">
                    </dd>
                    <dt>
                        <h3>vivo 44W闪充充电器</h3>
                        <p>六重保护系统</p>
                        <p>￥119.00</p>
                    </dt>
                </dl>
            </li>
            <li>
                <dl>
                    <dd>
                        <img src="img/HomePage/parts-08.webp" alt="">
                    </dd>
                    <dt>
                        <h3>闪充手游数据线</h3>
                        <p>官方品质│手游专属设计</p>
                        <p>￥59.00</p>
                    </dt>
                </dl>
            </li>
        </ul>
    </div>
    <!-- 底部 -->
    <div class="footer">
        <div class="footer-con">
            <div class="footer-con-t">
                <ul>
                    <li>
                        <span class="iconfont icon-Officialofficialtext"></span> 官方正品
                    </li>
                    <li>
                        <span class="iconfont icon-box"></span> 顺丰极速达
                    </li>
                    <li>
                        <span class="iconfont icon-like"></span> 全国联保
                    </li>
                    <li>
                        <span class="iconfont icon-shandianpeisong"></span> 镭雕定制
                    </li>
                </ul>
            </div>
            <div class="footer-con-m">
                <div class="m-link">
                    <ul>
                        <li>热门链接</li>
                        <li>X50 Pro</li>
                        <li>S7</li>
                        <li>NEX 3S</li>
                        <li>vivo摄影</li>
                        <li>查找手机</li>
                        <li>常见问题</li>
                    </ul>
                </div>
                <div class="m-buy">
                    <ul>
                        <li>在线购买</li>
                        <li>官方商城</li>
                        <li>选购手机</li>
                        <li>选购配件</li>
                        <li>企业服务</li>
                        <li>以旧换新</li>
                        <li>保障服务</li>
                    </ul>
                </div>
                <div class="m-service">
                    <ul>
                        <li>服务支持</li>
                        <li>体验店</li>
                        <li>服务首页</li>
                        <li>服务网点查询</li>
                        <li>真伪查询</li>
                        <li>预约维修</li>
                        <li>维修配件价格</li>
                        <li>服务政策</li>
                        <li>安全公告</li>
                    </ul>
                </div>
                <div class="m-community">
                    <ul>
                        <li>vivo社区</li>
                        <li>社区首页</li>
                        <li>摄影专区</li>
                        <li>新浪微博</li>
                        <li>百度贴吧</li>
                        <li>兴趣部落</li>
                    </ul>
                </div>
                <div class="m-about">
                    <ul>
                        <li>关于vivo</li>
                        <li>vivo简介</li>
                        <li>工作机会</li>
                        <li>新闻资讯</li>
                        <li>采购平台</li>
                        <li>供应商协同平台</li>
                        <li>开放平台</li>
                        <li>廉正合规</li>
                    </ul>
                </div>
                <div class="m-contact">
                    <ul>
                        <li>
                            <span class="iconfont icon-duanxin"></span> 在线客服
                        </li>
                        <li>
                            <span class="iconfont icon-dianhua"></span> 全国客户服务热线7*24小时
                        </li>
                        <li>
                            400-678-9688
                        </li>
                        <li>
                            <span class="iconfont icon-rexian"></span> NEX专属服务热线7*24小时
                        </li>
                        <li>
                            400-679-9688
                        </li>
                        <li>
                            <span class="iconfont icon-guanzhu"></span> 关注vivo
                        </li>
                        <li>
                            <div>
                                <span class="iconfont icon-weibo"></span>
                            </div>
                            <div>
                                <span class="iconfont icon-weixin-copy"></span>
                            </div>
                            <div>
                                <span class="iconfont icon-changyonglogo30erp"></span>
                            </div>
                            <div>
                                <span class="iconfont icon-lianjie"></span>
                            </div>
                        </li>
                    </ul>
                    <div class="vivo-score">
                        <img src="img/HomePage/vivo-store.png" alt="">
                        <p>公众号:vivo官方商城</p>
                    </div>
                    <div class="vivo-pay">
                        <img src="img/HomePage/vivo-pay.png" alt="">
                        <p>生活号:vivo智能手机</p>
                    </div>
                    <div class="vivo-app">
                        <img src="img/HomePage/vivo-app.jpg" alt="">
                        <p>小程序:vivo官方商城</p>
                    </div>
                </div>
            </div>
            <div class="footer-con-b">
                <div>
                    &copy;2011-2020广东天宸网络科技有限公司版权所有|隐私政策|法律声明|营业执照|粤B2-200802567|粤ICP备14052990号|粤公网安备44190032004246号
                </div>
                <div>
                    Select Location
                    <span class="iconfont icon-diqiu"></span>
                </div>
            </div>
        </div>
    </div>
    <!-- 侧边栏 -->
    <ul class="side">
        <li>
            <span class="iconfont icon-gouwuche"></span>
        </li>
        <li>
            <span class="iconfont icon-erji"></span>
        </li>
        <li>
            <span class="iconfont icon-wenhao"></span>
        </li>
        <li>
            <a href="#head">
                <span class="iconfont icon-shippingdefault"></span>
            </a>
        </li>
    </ul>


    <script src="lib/jquery.min.js"></script>
    <script src="lib/tool.js"></script>
    <script src="lib/common.js"></script>
    <script src="js/HomePage.js"></script>
</body>

</html>